<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- css 영역 -->
<link href="/css/bootstrap.css" rel="stylesheet" />
<link href="/css/bootstrap.min.css" rel="stylesheet" />
<!-- javascript 영역-->
<title>Left Sidebar - Arcana by HTML5 UP</title>
<meta name="description" content="" />
<meta name="keywords" content="" />

<script type="text/javascript">
	var subject = '';
	var content = '';
	var board_no = '';
	var update_user_id = '';
	/* var board_lev = ''; */
	var row_num	 = '';

	$(function() {
		$("#srchCategory").selectbox();
		$('.table_id_55').dataTable({
			"sDom" : '<"clear">fTtip',
			"sPaginationType" : "bootstrap",
			"oLanguage" : {
				"sLengthMenu" : "_MENU_ records per page"
			},
			"iDisplayLength" : 10, // 한 페이지에 보여질 레코드갯수
			"oTableTools" : {
				"sSwfPath" : "/swf/copy_csv_xls_pdf.swf",
				"aButtons" : [ {
					"sExtends" : "copy",
					"sButtonText" : "복사"
				}, {
					"sExtends" : "print",
					"sButtonText" : "인쇄"
				}, {
					"sExtends" : "xls",
					"sButtonText" : "엑셀"
				}, {
					"sExtends" : "user_pdf"
				} ]
			}
		});
		jQuery(".table_id_55_filter").find("input").attr("placeholder", "검색");
		function fnFormatDetails(oTable, nTr) {
			$('#modcBt').click(function() {
				$('.boxBg').hide();
				$('#modDiv').show();
			});

			$('#delcBt').click(function() { // 삭제
				var params = {
					row_num : row_num,
					board_id : $('#board_id').val()
				}
				if (confirm('정말 삭제하시겠습니까?')) {
					$.ajax({
						url : "/bd/ajax/deleteBoardContentInfo.do",
						type : "post",
						dataType : "json",
						data : params,
						success : function(data) {
							if (1 == data.resultInt1) {
								alert('삭제 되었습니다.');
								noticeSrch();
							} else {
								alert('오류가 발생하였습니다.');
							}
						}
					});
				}
			});

			$('#repcBt').click(function() {
				$('.boxBg').hide();
				$('#repDiv').show(row_num);
				

			});
			
		
			if (0 < $(nTr).find('table').length) {
				return;
			}
			var aData = oTable.fnGetData(nTr);

			row_num = aData[0];

			update_user_id = aData[2];
			var params = {
				row_num : aData[0],
				board_id : 2,
				board_no : board_no
			}

			$.ajax({
				url : "/bd/ajax/selectBoardContentInfo.do",
				type : "POST",
				dataType : "json",
				data : params,
				success : function(data) {
					var sOut = '<div>'
							+ '<div class="btn_area02 box2mt" style="margin-top:20px; ">'
							+ '		<div class="fr">'
							+ '			<a class="on" href="javascript:void(0);" id="repcBt"><span>답글</span></a>'
							+ '			<a class="on" href="javascript:void(0);" id="modcBt"><span>수정</span></a>'
							+ '			<a class="on" href="javascript:void(0);" id="delcBt"><span>삭제</span></a>'
							+ '		</div>'
							+ '	</div>'
							+ '</div>'
							+ '<table class="table_style01 view">'
							/* + '	<caption class="blind">내용 보기</caption>' */
							/* + ' <caption class="blind"> </caption>' */
							+ '	<colgroup>'
							+ '	</colgroup>'
							+ '	<tbody>'
							+ '		<tr>'
							+ '			<td>'
							+ '				<div class="textArea">'
							+ 					data.resultMap1.content
							+ '				</div>'
							+ '			</td>'
							+ '		</tr>'
							+ '</table>'
							+ '<table class="table_style01 view">'
							+ '	<colgroup>'
							+ '	</colgroup>'
							+ '	<tbody>'
							+ '  <div>'
							+ '     <tr>'
							+ '			<textarea tabindex="1" name="memo" id="memo" value="s" class="textarea" style="width:100%;height:122px;"></textarea>'
							+ '		</tr>'
							+ '     <tr>'
							+ '			<td align="right">'
							+ '         <input tabindex="2" type="button" rows="5" class="submit_c" name="reply_vote" value="저장" accesskey="s" onclick="insertBoardCommentInfo();" style="height:28px;width:80px">'
							+ '			</td>' + '		</tr>' + '  </div>'
							+ '	</tbody>' + '</table>'
					oTable.fnOpen(nTr, sOut, 'details');
					//그리드 뒷배경 영역을 조절.	
					$(".dataTables_wrapper").addClass("clear02");
					$('.dataTable').attr('style', 'width:100%;');
				}
			});
		
		}
		
		
		// 댓글 등록하기
		$('#repDat').click(function(){
		 	var params = {
					contents : $('#memo').val(),
					board_id : 2,
					row_num : row_num,
					board_dat_lev : 0,
					p_num : 0
		 	};

		 	$.ajax({
		 			url : "/bd/ajax/insertBoardCommentInfo.do"
		 			,type : "POST"
		 			,dataType : "json"
		 			,data : params
		 			,success : function(data) {
		 			 }
		 	});
		 });

		// 댓글 등록하기
		var insertBoardCommentInfo = function(){
		 	var params = {
					contents : $('#memo').val(),
					board_id : 2,
					row_num : row_num,
					board_dat_lev : 0,
					p_num : 0
		 	};

		 	$.ajax({
		 			url : "/bd/ajax/insertBoardCommentInfo.do"
		 			,type : "POST"
		 			,dataType : "json"
		 			,data : params
		 			,success : function(data) {
		 				
		 				
		 			 }
		 	});
		 }
		
		
		var noticeSrch = function() {
			showLoading(1, '.BoxArea');
			$('.table_id_55 > tbody > tr').each(function(i, d) {
				$('.table_id_55').dataTable().fnDeleteRow(0);
			});
			var params = {
				/* srchCategory : $('#srchCategory').val()
				, srchWord : $('#srchWord').val() */
				board_id : 2,
				board_no : board_no
			}
			$.ajax({
				url : "/bd/ajax/selectBoardContentList.do",
				type : "POST",
				dataType : "json",
				data : params,
				success : function(data) {
					var noticeCnt = data.retList1.length;
					data.retList1.forEach(function(notice) {
						var tableData = [];
						tableData.push(notice.row_num);
						tableData.push(notice.subject);
						tableData.push(notice.update_user_id);
						tableData.push(notice.create_date);
						tableData.push(notice.read_count);
						/* alert(tableData); */
						$('.table_id_55').dataTable().fnAddData(tableData);
						$('#update_user_id').html(notice.update_user_id);
					});
					$('.table_id_55 > tbody > tr').unbind('click');
					$('.table_id_55 > tbody > tr').css('cursor', 'pointer');
					$('.table_id_55 > tbody > tr').click(function() {
						if ($('.table_id_55').dataTable().fnIsOpen(this)) {
							$('.table_id_55').dataTable().fnClose(this);
						} else {
							fnFormatDetails($('.table_id_55').dataTable(), this);
						}
						//그리드 뒷배경 영역을 조절.	
						$(".dataTables_wrapper").addClass("clear02");
						$('.dataTable').attr('style','width:100%;');
					});

					$('.table_id_55 > tbody').bind('DOMNodeInserted',function() {
								$('.table_id_55 > tbody > tr').unbind('click');
								$('.table_id_55 > tbody > tr').click(
										function() {
											if ($('.table_id_55').dataTable().fnIsOpen(this)) {
												$('.table_id_55').dataTable().fnClose(this);
											} else {
												fnFormatDetails($('.table_id_55').dataTable(), this);
											}
											//그리드 뒷배경 영역을 조절.	
											$(".dataTables_wrapper").addClass("clear02");
											$('.dataTable').attr('style','width:100%;');
										});
							});
					//그리드 뒷배경 영역을 조절.	
					$(".dataTables_wrapper").addClass("clear02");
					$('.dataTable').attr('style', 'width:100%;');
					showLoading(0, '.BoxArea');
				}
			});
		}

		noticeSrch();
		$('.btn_search02').click(function() {
			$('#cPage').val(1);
			noticeSrch();
		});

		$('#wriBt').click(function() {
			$('.boxBg').hide();
			$('#insDiv').show();

		})

		$('#insBt').click(function() { //글쓰기
			var params = {
				subject : $('#subject').val(),
				content : $('#free_content').val(),
				category_id : $('#category').val(),
				board_id : $('#board_id').val(),
				board_lev : $('#board_lev').val(),
				p_num : row_num
			}
			$.ajax({
				url : "/bd/ajax/insertBoardContentInfo.do",
				type : "POST",
				dataType : "json",
				data : params,
				success : function(data) {
					$('#insDiv').hide();
					$('.boxBg').show();
					noticeSrch();
				}
			});
		});

		$('#repBt').click(function() { //답글쓰기
			alert(row_num);
			var params = {
				subject : $('#rep_subject').val(),
				content : $('#rep_free_content').val(),
				category_id : $('#category').val(),
				board_id : $('#board_id').val(),
				board_lev : $('#rep_board_lev').val(),
				p_num : row_num
			}
			$.ajax({
				url : "/bd/ajax/insertBoardContentInfo.do",
				type : "POST",
				dataType : "json",
				data : params,
				success : function(data) {
					$('#repDiv').hide();
					$('.boxBg').show();
					noticeSrch();
				}
			});
		});
		// 게시글 수정
		$('#modBt').click(function() {
			var params = {
				board_id : 2,
				subject : $('#mod_subject').val(),
				content : $('#mod_content').val(),
				row_num : row_num
			}
			if (confirm('수정 하시겠습니까?')) {
				$.ajax({
					url : '/bd/ajax/updateBoardContentInfo.do',
					type : 'post',
					data : params,
					dataType : "json",
					success : function(data) {
						if (1 == data.resultInt1) {
							alert('수정 되었습니다.');
							$('#modDiv').hide();
							$('.boxBg').show();
							noticeSrch();
						} else {
							alert('오류가 발생하였습니다.');
						}
					}
				});
			}

		});
	});
</script>
</head>
<body>
	<!-- Main -->
	<section class="wrapper style1">
		<div class="container">
			<div class="row double">
				<div class="4u">
					<div id="sidebar">
						Sidebar
						<section>
							<h3>Just a Subheading</h3>
							<p>Phasellus quam turpis, feugiat sit amet ornare in,
								hendrerit in lectus. Praesent semper mod quis eget mi. Etiam eu
								ante risus. Aliquam erat volutpat. Aliquam luctus et mattis
								lectus sit amet pulvinar. Nam turpis et nisi etiam.</p>
							<footer>
								<a href="#" class="button">Continue Reading</a>
							</footer>
						</section>

						<section>
							<h3>Another Subheading</h3>
							<ul class="links">
								<li><a href="#">Amet turpis, feugiat et sit amet</a></li>
								<li><a href="#">Ornare in hendrerit in lectus</a></li>
								<li><a href="#">Semper mod quis eget mi dolore</a></li>
								<li><a href="#">Consequat etiam lorem phasellus</a></li>
								<li><a href="#">Amet turpis, feugiat et sit amet</a></li>
								<li><a href="#">Semper mod quisturpis nisi</a></li>
							</ul>
							<footer>
								<a href="#" class="button">More Random Links</a>
							</footer>
						</section>
					</div>
				</div>

				<div class="8u skel-cell-important">
					<div id="content">
						<form name="srchForm" id="srchForm" method="post">
							<input type="hidden" name="cPage" id="cPage"
								value='<c:out value="${cPage}"/>' />
							<%-- <!-- 도움말, 인쇄, 북마크 -->
			<div class="clear">
				<ul class="sideList">
					<jsp:include page="/WEB-INF/decorator/assist.jsp" />
				</ul>
			</div>
			<!-- //도움말, 인쇄, 북마크 --> --%>

							<!-- 탭영역 -->
							<section class="tabBox mt10">
								<div class="boxBg">
									<!-- 탭 상세 -->
									<%-- <div class="tabDetailGroup">
						<div class="layerGroup clear02">
							<!-- layerOne -->
							<div class="layerOne clear02 pb15">						
								<div class="fl pl31">
									<label for="srchWord">검색어</label>
									<input type="text" name="srchWord"  id="srchWord"  value="" class="fl input_style02 w269"  value='<c:out value="${param.srchWord}" />' />
								</div>
							</div>
							<!-- //layerOne -->
							<p class="btn_search02"><a href="javascript:void(0);"><span>검색</span></a></p>
						</div>
					</div> --%>
									<!-- //탭 상세 -->
								</div>
							</section>
							<!-- //탭영역 -->

							<!-- 테이블 -->
							<section class="BoxArea">
								<div class="boxBg">
									<!-- 차트 데이터 -->
									<article class="tableGroup02">
										<h2 class="mb0"></h2>
										<table class="table table_id_55" id="table_data">
											<caption class="blind"></caption>
											<colgroup>
												<col width="10%" />
												<col width="45%" />
												<col width="20%" />
												<col width="15%" />
												<col width="10%" />
											</colgroup>
											<thead>
												<tr>
													<th scope="col">번호</th>
													<th scope="col">제목</th>
													<th scope="col">작성자</th>
													<th scope="col">작성일</th>
													<th scope="col">조회수</th>
												</tr>
											</thead>
											<tbody>
												<tr>
													<td>&nbsp;</td>
													<td>&nbsp;</td>
													<td>&nbsp;</td>
													<td>&nbsp;</td>
													<td>&nbsp;</td>
												</tr>
											</tbody>
										</table>
										<a class="on" href="javascript:void(0);" id="wriBt"><span>글쓰기</span></a>
									</article>
								</div>
							</section>
							<!-- //테이블 -->
						</form>

						<!-- 게시글 쓰기 -->
						<div id="insDiv" class="" style="display: none;">
							<div id="content">
								<article>
									<header>
										<h2>글쓰기</h2>
									</header>
									<div class="table-responsively">
										<table id="insertTable" class="table table-striped">
											<tbody>
												<tr>
													<th>제목</th>
													<td><input type="text" name="subject" id="subject" /></td>
													<td><input type="hidden" name="category" id="category"	value="일반" /></td>
													<td><input type="hidden" name="board_id" id="board_id"	value="2" /></td>
													<td><input type="hidden" id="board_lev" value="0" /></td>
												</tr>
												<tr>
													<th>글쓰기</th>
													<td><textarea name="free_content" id="free_content"></textarea></td>
												</tr>
											</tbody>
										</table>
									</div>
									<div class="btn_area02 box2mt" style="margin-top: 20px;">
										<div class="fr">
											<a class="on" href="javascript:void(0);" id="insBt"><span>확인</span></a>
											<a class="on" href="" onClick="noticeSrch();"><span>취소</span></a>
										</div>
									</div>
								</article>
							</div>
						</div>
						<!-- 답글 쓰기 -->
						<div id="repDiv" class="" style="display: none;">
							<div id="content">
								<article>
									<header>
										<h2>글쓰기</h2>
									</header>
									<div class="table-responsively">
										<table id="insertTable" class="table table-striped">
											<tbody>
												<tr>
													<th>제목</th>
													<td><input type="text" name="subject" id="rep_subject" /></td>
													<td><input type="hidden" name="category" id="category"	value="일반" /></td>
													<td><input type="hidden" name="board_id" id="board_id"	value="2" /></td>
													<td><input type="hidden" id="rep_board_lev" value="1" /></td>
													<td><input type="hidden" id="p_num" value="row_num"/></td>
												</tr>
												<tr>
													<th>글쓰기</th>
													<td><textarea name="free_content" id="rep_free_content"></textarea></td>
												</tr>
											</tbody>
										</table>
									</div>
									<div class="btn_area02 box2mt" style="margin-top: 20px;">
										<div class="fr">
											<a class="on" href="javascript:void(0);" id="repBt"><span>확인</span></a>
											<a class="on" href="" onClick="noticeSrch();"><span>취소</span></a>
										</div>
									</div>
								</article>
							</div>
						</div>

						<!-- 게시글 수정하기 -->
						<div id="modDiv" class="modDiv" style="display: none;">
							<div id="content">
								<article>
									<header>
										<h2>게시글 수정하기</h2>
									</header>
									<div class="table-responsively">
										<table id="modifyTable" class="table table-striped">
											<tbody>
												<tr>
													<td>제목</td>
													<td><input type="text" id="mod_subject" /></td>
												</tr>
												<tr>
													<td>작성자</td>
													<td><span id="update_user_id"></span></td>
												</tr>
												<tr>
													<td>내용</td>
													<td><textarea id="mod_content"></textarea></td>
												</tr>
											</tbody>
										</table>
									</div>
									<div>
										<div class="btn_area02 box2mt" style="margin-top: 20px;">
											<div class="fr">
												<a class="on" href="javascript:void(0);" id="modBt"><span>수정</span></a>
												<a class="on" href="" onClick="noticeSrch();"><span>취소</span></a>
											</div>
										</div>
									</div>
								</article>
							</div>
						</div>

					</div>
				</div>
			</div>
		</div>
	</section>
</body>
</html>
